<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<%@ include file="/jsp/common/common.jsp" %>
</head>
<body>

<div class="documentContent"  id="documentContent">
	<div class="top-div"><em></em><span>&nbsp;>&nbsp;系统监控&nbsp;>&nbsp;概要信息</span></div>
	
	<div>
	    <table width="100%" border="0" cellpadding="0" cellspacing="0" class="search-table">
	      <tr>
	        <td style="float: right;">
		        <button class="btn-table" id="searchButton">查询</button>
	        </td>
	      </tr>
	    </table>
	  </div>
	
	<!-- form-box -->
	<div class="form-box">
		<h2 class="form-title">内存池信息<em class="show"></em></h2>
		<div class="form-content">
			<table width="100%" border="0" cellpadding="0" cellspacing="0" class="form-subtable">
				<thead>
					<tr>
						<th width="20%">名称</th>
						<th width="10%">类型</th>
						<th width="15%">init</th>
						<th width="15%">commit</th>
						<th width="15%">max</th>
						<th width="15%">used</th>
					</tr>
				</thead>
				<tbody id="memoryTbody"></tbody>
			</table>
		</div>
	</div>
	<!-- form-box -->
	
	
	<!-- form-box -->
	<div class="form-box">
		<h2 class="form-title">内存信息<em class="show"></em></h2>
		<div class="form-content">
		 	<table width="100%" border="0" cellpadding="0" cellspacing="0" class="form-table">
		 		<tr>
		 			<td class="form-table-tdleft" width="25%">最大堆内存(MB)</td>
		 			<td width="25%"><span id="heapMemoryUsageMax_span"></span></td>
		 			<td class="form-table-tdleft" width="25%">初始化堆内存(MB)</td>
		 			<td width="25%"><span id="heapMemoryUsageInit_span"></span></td>
		 		</tr>
		 		<tr>
		 			<td class="form-table-tdleft" width="25%">已提交堆内存(MB)</td>
		 			<td width="25%"><span id="heapMemoryUsageCommitted_span"></span></td>
		 			<td class="form-table-tdleft" width="25%">已使堆内存(MB)</td>
		 			<td width="25%"><span id="heapMemoryUsageUsed_span"></span></td>
		 		</tr>
		 		<tr>
		 			<td class="form-table-tdleft" width="25%">最大非堆内存(MB)</td>
		 			<td width="25%"><span id="nonHeapMemoryUsageMax_span"></span></td>
		 			<td class="form-table-tdleft" width="25%">初始化非堆内存(MB)</td>
		 			<td width="25%"><span id="nonHeapMemoryUsageInit_span"></span></td>
		 		</tr>
		 		<tr>
		 			<td class="form-table-tdleft" width="25%">已提交非堆内存(MB)</td>
		 			<td width="25%"><span id="nonHeapMemoryUsageCommitted_span"></span></td>
		 			<td class="form-table-tdleft" width="25%">已使非堆内存(MB)</td>
		 			<td width="25%"><span id="nonHeapMemoryUsageUsed_span"></span></td>
		 		</tr>
		 	</table>
		</div>
	</div>
	<!-- form-box -->
	
	<!-- form-box -->
	<div class="form-box">
		<h2 class="form-title">垃圾回收信息<em class="show"></em></h2>
		<div class="form-content">
			<table width="100%" border="0" cellpadding="0" cellspacing="0" class="form-subtable">
				<thead>
					<tr>
						<th width="10%">名称</th>
						<th width="50%">内存池名称</th>
						<th width="20%">回收总次数</th>
						<th width="20%">回收时间（秒）</th>
					</tr>
				</thead>
				<tbody id="gcTbody"></tbody>
			</table>
		</div>
	</div>
	<!-- form-box -->
	
	<!-- form-box -->
	<div class="form-box">
		<h2 class="form-title">操作系统信息<em class="show"></em></h2>
		<div class="form-content">
		 	<table width="100%" border="0" cellpadding="0" cellspacing="0" class="form-table">
		 		<tr>
		 			<td class="form-table-tdleft" width="25%">操作系统名称</td>
		 			<td width="25%"><span id="systemName_span"></span></td>
		 			<td class="form-table-tdleft" width="25%">架构</td>
		 			<td width="25%"><span id="systemArch_span"></span></td>
		 		</tr>
		 		<tr>
		 			<td class="form-table-tdleft" width="25%">操作系统版本</td>
		 			<td width="25%"><span id="systemVersion_span"></span></td>
		 			<td class="form-table-tdleft" width="25%">可用核心数量</td>
		 			<td width="25%"><span id="AvailableProcessors_span"></span></td>
		 		</tr>
		 	</table>
		</div>
	</div>
	<!-- form-box -->
	
	<!-- form-box -->
	<div class="form-box">
		<h2 class="form-title">虚拟机运行时信息<em class="show"></em></h2>
		<div class="form-content">
		 	<table width="100%" border="0" cellpadding="0" cellspacing="0" class="form-table">
		 		<tr>
		 			<td class="form-table-tdleft" width="25%">Java虚拟机名称</td>
		 			<td width="25%"><span id="RunVmName_span"></span></td>
		 			<td class="form-table-tdleft" width="25%">Java虚拟机实现名称</td>
		 			<td width="25%"><span id="VmName_span"></span></td>
		 		</tr>
		 		<tr>
		 			<td class="form-table-tdleft" width="25%">Java虚拟机实现供应商</td>
		 			<td width="25%"><span id="VmVendor_span"></span></td>
		 			<td class="form-table-tdleft" width="25%">Java 虚拟机规范版本</td>
		 			<td width="25%"><span id="SpecVersion_span"></span></td>
		 		</tr>
		 		<tr>
		 			<td class="form-table-tdleft" width="25%">Java虚拟机启动时间</td>
		 			<td width="25%"><span id="StartTime_span"></span></td>
		 			<td class="form-table-tdleft" width="25%">Java虚拟机正常运行时间（秒）</td>
		 			<td width="25%"><span id="Uptime_span"></span></td>
		 		</tr>
		 		<tr>
		 			<td class="form-table-tdleft" width="25%">加载到Java虚拟机中的类的数量</td>
		 			<td width="25%"><span id="LoadedClassCount_span"></span></td>
		 			<td class="form-table-tdleft" width="25%">卸载的类的总数</td>
		 			<td width="25%"><span id="UnloadedClassCount_span"></span></td>
		 		</tr>
		 		<tr>
		 			<td class="form-table-tdleft" width="25%">JIT编译器的名称</td>
		 			<td width="25%"><span id="CompilationName_span"></span></td>
		 			<td class="form-table-tdleft" width="25%">编译累积耗费时间(秒)</td>
		 			<td width="25%"><span id="TotalCompilationTime_span"></span></td>
		 		</tr>
		 		<tr>
		 			<td class="form-table-tdleft" width="25%">Java虚拟机参数</td>
		 			<td width="75%" colspan="3"><span id="javArg_span"></span></td>
		 		</tr>
		 	</table>
		</div>
	</div>
	<!-- form-box -->
	
	
	
</div>

<script type="text/javascript">
$(document).ready(function(){
	
	getPageData();

	blindPageElement();
	
});

function blindPageElement(){
	$(".form-title").click(function(){
        var b = $(this).parent(".form-box").children(".form-content");
        if(b.css("display") == "block"){
			b.slideUp();
            $(this).children("em").removeClass("show");
            $(this).children("em").addClass("hide");
        }else{
            $(this).children("em").removeClass("hide");
            $(this).children("em").addClass("show");
			b.slideDown();
        }
    });
	
	$('#searchButton').on('click',function(){
		getPageData();
	});
}

function getPageData(){
 	var url = '<%=basePath%>/webframework/monitor/systemMonitor/getOverviewData.do';
	$.ajax({  
        url:url,  
        type:'post',  
        dataType:'json',  
        success:function(data,textStatus,jqXHR){  
        	$.each(data,function(key,value){
        		if($('#'+key+'_span')){
        			$('#'+key+'_span').html(value);
        		}
        	});
    		writeJVMarg(data.argList);
    		writeGcTbody(data.gcInfoList);
    		writeMemoryTbody(data.memoryList);
        },  
        error:function(XMLHttpRequest,textStatus,errorThrown){  
        }                     
    });
	
}

function writeMemoryTbody(data){
	
	var memoryTbody = $('#memoryTbody');
	$(memoryTbody).empty();
	
	$(data).each(function(index,element){
		var trObj = $('<tr></tr>');
		
		$(trObj).append('<td>'+element.poolName+'</td>');
		$(trObj).append('<td>'+element.memoryType+'</td>');
		$(trObj).append('<td>'+element.Init+' MB</td>');
		$(trObj).append('<td>'+element.Committed+' MB</td>');
		$(trObj).append('<td>'+element.Max+' MB</td>');
		$(trObj).append('<td>'+changeName(element.poolName,element.memoryType)+element.Used+' MB('+element.percent+')</td>');
		
		$(memoryTbody).append(trObj);
	});
}

function changeName(str,memoryType){
	
	if(!str || memoryType === 'Non-heap memory'){
		return '';
	}
	
	if(str === 'PS Eden Space'){
		return '[E]';
	}else if( str === 'PS Survivor Space'){
		return '[S]';
	}else if(str === 'PS Old Gen'){
		return '[O]';
	}else{
		return '['+str+']';
	}
	
}

function writeGcTbody(data){
	var gcTbody = $('#gcTbody');
	$(gcTbody).empty();
	
	$(data).each(function(index,element){
		
		var trObj = $('<tr></tr>');
		
		$(trObj).append('<td>'+element.Name+'</td>');
		var poolNameStr = '';
		$(element.poolNameArray).each(function(i,e){
			poolNameStr = poolNameStr + e + ' ';
		});
		$(trObj).append('<td>'+poolNameStr+'</td>');
		$(trObj).append('<td>'+element.CollectionCount+'</td>');
		$(trObj).append('<td>'+element.CollectionTime+'</td>');
		
		
		$(gcTbody).append(trObj);
	});
}

function writeJVMarg(data){
	
	var html = '';
	
	$(data).each(function(index,element){
		html = html + element + '</br>';
	});
	
	$('#javArg_span').html(html);
	
}

</script>
</body>
</html>